<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%
	String basePath = request.getScheme() + "://" + request.getServerName() + ":" +
			request.getServerPort() + request.getContextPath() + "/";
%>

<html lang="en">
<head>
	<base href="<%=basePath%>" />
	<meta charset="UTF-8">
	<link href="jquery/bootstrap_3.3.0/css/bootstrap.min.css" type="text/css" rel="stylesheet" />
	<script type="text/javascript" src="jquery/jquery-1.11.1-min.js"></script>
	<script type="text/javascript" src="jquery/bootstrap_3.3.0/js/bootstrap.min.js"></script>
	<script type="text/javascript">

		//页面加载完毕，进入页面就会加载
		$(function(){
			//导航中所有文本颜色为黑色
			$(".liClass > a").css("color" , "black");

			//默认选中导航菜单中的第一个菜单项
			$(".liClass:first").addClass("active");

			//第一个菜单项的文字变成白色
			$(".liClass:first > a").css("color" , "white");

			//给所有的菜单项注册鼠标单击事件
			$(".liClass").click(function(){
				//移除所有菜单项的激活状态
				$(".liClass").removeClass("active");
				//导航中所有文本颜色为黑色
				$(".liClass > a").css("color" , "black");
				//当前项目被选中
				$(this).addClass("active");
				//当前项目颜色变成白色
				$(this).children("a").css("color","white");
			});


			//window.open("workbench/main/index.html","workareaFrame");
			window.open("image/2.jpg","workareaFrame");
		});

		$(function () {

			//页面加载完毕的时候 用户名栏自动获取焦点
			$("#loginAct").focus();

			// 页面加载完毕的时候 清空文本框
			$("#loginAct").val("");
			$("#loginPwd").val("");
			$("#newloginPwd").val("");
			$("#newloginPwd2").val("");

			//	按钮绑定登录的方法
			$("#updateBtn").click(function () {
				update();
			});

			// 为当前窗口绑定键盘事件
			// 这个参数表示按下的键
			$(window).keydown(function (event) {

				// 如果敲击的键盘键值为13 代表敲击的是回车 调用登录方法
				if (event.keyCode == 13){
					update();
				}
			})

		});

		function update() {
			var loginAct = $("#loginAct");
			var loginPwd = $("#loginPwd");
			var newloginPwd = $("#newloginPwd")
			var newloginPwd2=$("#newloginPwd2")
			if($.trim(loginAct.val()) == "" ){
				$("#msg").html("账号不能为空！");
				loginAct.focus();
				return ;
			}else if($.trim(loginPwd.val()) == ""){
				$("#msg").html("密码不能为空！");
				loginPwd.focus();
				return ;
			}else if($.trim(newloginPwd.val()) == ""){
				$("#msg").html("新密码不能为空！");
				newloginPwd.focus();
				return ;
			}else if($.trim(newloginPwd2.val()) != $.trim(newloginPwd.val())){
				$("#msg").html("两次输入的密码不一样");
				newloginPwd2.focus();
				return ;
			}

			// 发起ajax请求
			$.ajax({
				url:"workbench/manage/UpdateUser.do",
				data:{"loginAct":loginAct.val(),"loginPwd":loginPwd.val(),"newloginPwd":newloginPwd.val(),"newloginPwd2":newloginPwd2.val()},
				type:"post",
				dataType:"json",
				success:function (data) {
					// flag为true 代表成功  跳转到操作页面页面
					if(data.success){
						document.location = "login.jsp";
					}else{
						// flag为false 代表失败 提示msg信息
						$("#msg").html(data.msg);
					}
				}
			});
		}

	</script>

</head>
<body>

<!-- 我的资料 -->
<div class="modal fade" id="myInformation" role="dialog">
	<div class="modal-dialog" role="document" style="width: 30%;">
		<div class="modal-content">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal">
					<span aria-hidden="true">×</span>
				</button>
				<h4 class="modal-title">我的资料</h4>
			</div>
			<div class="modal-body">
				<div style="position: relative; left: 40px;">
					姓名：<b>李四</b><br><br>
					登录帐号：<b>lisi</b><br><br>
					组织机构：<b>235宿舍，科技班，肇庆学院</b><br><br>
					邮箱：<b>lisi@bjpowernode.com</b><br><br>
					失效时间：<b>2021-11-30 23:50:55</b><br><br>
					允许访问IP：<b>0:0:0:0:0:0:0:1</b>
				</div>
			</div>
			<div class="modal-footer">
				<button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
			</div>
		</div>
	</div>
</div>

<!-- 修改密码的模态窗口 -->
<div class="modal fade" id="editPwdModal" role="dialog"  >
	<div class="modal-dialog" role="document" style="width: 70%;height: 60%;">
		<div class="modal-content">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal">
					<span aria-hidden="true">×</span>
				</button>
				<h4 class="modal-title">修改密码</h4>
			</div>

			<center>
				<form action="login.jsp" class="form-horizontal" role="form">
					<div class="form-group form-group-lg">
						<br/>

						<div style="width: 350px;">
							<input class="form-control" type="text" placeholder="用户名" name="loginAct" id="loginAct"/>
						</div>

						<br/>
						<div style="width: 350px; ">
							<input class="form-control" type="password" placeholder="密码" name="loginPwd"  id="loginPwd"/>
						</div>
						<br/>

						<div style="width: 350px; ">
							<input class="form-control" type="password" placeholder="新密码" name="newloginPwd"  id="newloginPwd"/>
						</div>
						<br/>

						<div style="width: 350px;">
							<input class="form-control" type="password" placeholder="确认密码" name="newloginPwd2"  id="newloginPwd2"/>
						</div>
						<br/>

						<div>
							<button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
							<button id="updateBtn" type="button" class="btn btn-primary"  data-dismiss="modal">更新</button>
						</div>
						<div class="checkbox"  style="position: relative;top: 10px; left: 10px;">
							<span id="msg" style="color: #ff0000"></span>
						</div>


					</div>
				</form>
			</center>
		</div>
	</div>
</div>



<!-- 退出系统的模态窗口 -->
<div class="modal fade" id="exitModal" role="dialog">
	<div class="modal-dialog" role="document" style="width: 30%;">
		<div class="modal-content">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal">
					<span aria-hidden="true">×</span>
				</button>
				<h4 class="modal-title">离开</h4>
			</div>
			<div class="modal-body">
				<p>您确定要退出系统吗？</p>
			</div>
			<div class="modal-footer">
				<button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
				<button type="button" class="btn btn-primary" data-dismiss="modal" onclick="window.location.href='login.jsp';">确定</button>
			</div>
		</div>
	</div>
</div>

<!-- 顶部 -->
<div id="top" style="height: 50px; background-color: #3C3C3C; width: 100%;">
	<div style="position: absolute; top: 5px; left: 0px; font-size: 30px; font-weight: 400; color: white; font-family: 'times new roman'">船只管理系统 &nbsp;<span style="font-size: 12px;">&copy;2021&nbsp;CYH</span></div>
	<div style="position: absolute; top: 15px; right: 15px;" id="workbench">
		<ul>
			<li class="dropdown manage-dropdown">
				<a href="javascript:void(0)" style="text-decoration: none; color: white;" class="dropdown-toggle" data-toggle="dropdown">

					<span class="glyphicon glyphicon-manage"></span>${sessionScope.manage.name}<span class="caret"></span>
					&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
				</a>
				<ul class="dropdown-menu">
					<%--						<li><a href="workbench/index.html"><span class="glyphicon glyphicon-wrench"></span> 系统设置</a></li>--%>
					<li><a href="javascript:void(0)" data-toggle="modal" data-target="#myInformation"><span class="glyphicon glyphicon-file"></span> 我的资料</a></li>
					<li><a href="javascript:void(0)" data-toggle="modal" data-target="#editPwdModal"><span class="glyphicon glyphicon-edit"></span> 修改密码</a></li>
					<li><a href="javascript:void(0);" data-toggle="modal" data-target="#exitModal"><span class="glyphicon glyphicon-off"></span> 退出</a></li>
				</ul>
			</li>
		</ul>
	</div>
</div>



<!-- 中间 -->
<div id="center" style="position: absolute;top: 50px; bottom: 30px; left: 0px; right: 0px;">

	<!-- 导航 -->
	<div id="navigation" style="left: 0px; width: 18%; position: relative; height: 100%; overflow:auto;">

		<ul id="no1" class="nav nav-pills nav-stacked">
			<li class="liClass"><a href="workbench/ship_user_zl/index.jsp" target="workareaFrame"><span class="glyphicon glyphicon-play-circle"></span> 用户管理</a></li>
			<li class="liClass">
				<a href="#no4" class="collapsed" data-toggle="collapse"><span class="glyphicon glyphicon-stats"></span>船只基本资料管理</a>
				<ul id="no4" class="nav nav-pills nav-stacked collapse">
					<li class="liClass"><a href="workbench/ship_zl/ship_zl.jsp" target="workareaFrame">&nbsp;&nbsp;&nbsp;<span class="glyphicon glyphicon-chevron-right"></span>船只资料</a></li>
					<li class="liClass"><a href="workbench/ship_zl/owner.jsp" target="workareaFrame">&nbsp;&nbsp;&nbsp;<span class="glyphicon glyphicon-chevron-right"></span>船只所有人管理</a></li>
				</ul>
			</li>
			<li class="liClass">
				<a href="#no3" class="collapsed" data-toggle="collapse"><span class="glyphicon glyphicon-stats"></span>船只营运证书资料管理</a>
				<ul id="no3" class="nav nav-pills nav-stacked collapse">
					<li class="liClass"><a href="workbench/ship_yingyun/YingYun.jsp" target="workareaFrame">&nbsp;&nbsp;&nbsp;<span class="glyphicon glyphicon-chevron-right"></span>营运证书处理历史表</a></li>
					<li class="liClass"><a href="workbench/ship_yingyun/yingYun_gangAo.jsp" target="workareaFrame">&nbsp;&nbsp;&nbsp;<span class="glyphicon glyphicon-chevron-right"></span> 港澳航线船舶营运证</a></li>
					<li class="liClass"><a href="workbench/ship_yingyun/history_gangao.jsp" target="workareaFrame">&nbsp;&nbsp;&nbsp;<span class="glyphicon glyphicon-chevron-right"></span> 港澳证明处理历史表</a></li>
					<li class="liClass"><a href="workbench/ship_yingyun/gangAo_hangXing.jsp" target="workareaFrame">&nbsp;&nbsp;&nbsp;<span class="glyphicon glyphicon-chevron-right"></span> 航行港澳船舶证明书</a></li>
				</ul>
			</li>
			<li class="liClass"><a href="workbench/ship_anjian_zs/index.jsp" target="workareaFrame"><span class="glyphicon glyphicon-earphone"></span>船只安检证书资料管理</a></li>
			<li class="liClass">
				<a href="#no2" class="collapsed" data-toggle="collapse"><span class="glyphicon glyphicon-stats"></span> 船只检验证书资料管理</a>
				<ul id="no2" class="nav nav-pills nav-stacked collapse">
					<li class="liClass"><a href="workbench/check/check_year.jsp" target="workareaFrame">&nbsp;&nbsp;&nbsp;<span class="glyphicon glyphicon-chevron-right"></span>年度检验处理</a></li>
					<li class="liClass"><a href="workbench/check/check_center.jsp" target="workareaFrame">&nbsp;&nbsp;&nbsp;<span class="glyphicon glyphicon-chevron-right"></span> 中间检验处理</a></li>
					<li class="liClass"><a href="workbench/check/check_wunei.jsp" target="workareaFrame">&nbsp;&nbsp;&nbsp;<span class="glyphicon glyphicon-chevron-right"></span> 坞内检验处理</a></li>
					<li class="liClass"><a href="workbench/check/check_special.jsp" target="workareaFrame">&nbsp;&nbsp;&nbsp;<span class="glyphicon glyphicon-chevron-right"></span> 特别检验处理历史表</a></li>
					<li class="liClass"><a href="workbench/check/check_luoxuan.jsp" target="workareaFrame">&nbsp;&nbsp;&nbsp;<span class="glyphicon glyphicon-chevron-right"></span>螺旋桨尾轴检验处理</a></li>
					<li class="liClass"><a href="workbench/check/check_guolu.jsp" target="workareaFrame">&nbsp;&nbsp;&nbsp;<span class="glyphicon glyphicon-chevron-right"></span> 锅炉检验处理</a></li>
					<li class="liClass"><a href="workbench/ship_anjian_zs/index.jsp" target="workareaFrame">&nbsp;&nbsp;&nbsp;<span class="glyphicon glyphicon-chevron-right"></span>检修证明表</a></li>
				</ul>
			</li>
			<li class="liClass"><a href="workbench/ship_guoji_zs_zl/index.jsp" target="workareaFrame"><span class="glyphicon glyphicon-leaf"></span> 船只国籍配员证书资料管理</a></li>
			<li class="liClass"><a href="workbench/ship_hangdao_cost/index.jsp" target="workareaFrame"><span class="glyphicon glyphicon-usd"></span> 船只缴纳航道费情况</a></li>
			<li class="liClass"><a href="workbench/ship_water_cost/index.jsp" target="workareaFrame"><span class="glyphicon glyphicon-usd"></span> 船只缴纳水运费情况</a></li>
		</ul>
		<!-- 分割线 -->
		<div id="divider1" style="position: absolute; top : 0px; right: 0px; width: 1px; height: 100% ; background-color: #B3B3B3;"></div>
	</div>



	<!-- 工作区 ，也就是进行数据操作那一行-->
	<div id="workarea" style="position: absolute; top : 0px; left: 18%; width: 82%; height: 100%;">
		<iframe style="border-width: 0px; width: 100%; height: 100%;" name="workareaFrame"></iframe>
	</div>

</div>

<div id="divider2" style="height: 1px; width: 100%; position: absolute;bottom: 30px; background-color: #B3B3B3;"></div>

<!-- 底部 -->
<div id="down" style="height: 30px; width: 100%; position: absolute;bottom: 0px;"></div>

</body>
</html>